var imgdir = imgdir || '.';

var pc2009 = pc2009 || {};
pc2009.newBlock = function(x, y, color) {
	// var
	var m_x = x;
	var m_y = y;
	var m_color = color;

	var m_DOM = jQuery('<img border="0" style="position: absolute; width: 32px; height: 32px; z-index: 1;" />');
	m_DOM.css('left', m_x*32).css('top', m_y*32).attr('src', imgdir+'/'+color+'.png');
	// method
	var m_move = function(x, y) {
		m_x = x;
		m_y = y;
		m_DOM.animate({left:x*32, top:y*32}, 500, 'linear');
	};
	var m_setColor = function(c) {
		m_color = c;
		m_DOM.attr('src', imgdir+'/'+c+'.png');
	};
	var m_getColor = function() {
		return m_color;
	};
	// init
	m_DOM.move = m_move;
	m_DOM.setColor = m_setColor;
	m_DOM.getColor = m_getColor;
	return m_DOM;
};

var pc2009 = pc2009 || {};
pc2009.newMouseSensor2 = function(x, y, dx, dy, callback, over_callback) {
	// var
	var m_DOM = jQuery('<img src="'+imgdir+'/s.png" style="position: absolute; width: 16px; height: 16px; z-index: 100;" />');
	m_DOM.css('left', x*32 + dx*16).css('top', y*32 + dy*16);
	m_DOM.click(function(){
		if(callback){
			callback(x, y, dx, dy);
		}
	});
	m_DOM.mouseover(function(){
		if(over_callback){
			over_callback(x, y, dx, dy);
		}
	});
	return m_DOM;
};

var pc2009 = pc2009 || {};
pc2009.newBoard = function(callback) {
	// var
	var m_callback = callback;
	var m_DOM = jQuery('<div style="position: relative;"></div>');
	var m_border = jQuery('<img src="'+imgdir+'/s.png" style="position: absolute; z-index: 50; border: 3px solid black;" />');
	var m_border_pen = function(x, y){
		m_border.hide();
		m_border.css('width', 32);
		m_border.css('height', 32);
		m_border.css('left', x*32-3);
		m_border.css('top', y*32-3);
		m_border.show();
	};
	var m_border_move = function(x, y, size){
		m_border.hide();
		m_border.css('width', 32*size);
		m_border.css('height', 32*size);
		m_border.css('left', x*32-size*16-3);
		m_border.css('top', y*32-size*16-3);
		m_border.show();
	};
	var m_border_hide = function(){
		m_border.hide();
	};
	m_border_hide();
	m_DOM.append(m_border);

	var m_size = 5;
	var m_maxsize = 20;
	var m_r = 1;
	var m_pen = 0;
	var m_mode = 1;
	var m_map = [];
	// method
	var m_getCsv = function(){
		var max_color = 0;
		var csv = '';
		for(var y=0; y<m_size; ++y){
			var line = '';
			for(var x=0; x<m_size; ++x){
				if(x!=0){
					line += ',';
				}
				var c = m_map[y][x].getColor();
				if(max_color<c){
					max_color = c;
				}
				line += c;
			}
			line += "\r\n";
			csv += line;
		}
		csv = m_size + "," + (max_color+1) + "\r\n" + csv;
		return csv;
	};
	var m_loadCsv = function(csv){
		var lines = csv.replace("\r\n", "\n").replace("\r", "\n").split("\n");
		for(var i=0; i<lines.length; ++i) {
			var rows = lines[i].split(",");
			if(i==0){
				if(rows[0]!=""){
					m_setSize(parseInt(rows[0]));
				}
			}
			else{
				for(var j=0; j<rows.length; ++j) {
					if(rows[j]!=""){
						m_map[i-1][j].setColor(parseInt(rows[j]));
					}
				}
			}
		}
		if(m_callback){
			m_callback();
		}
	};
	var m_setSize = function(s){
		m_size = s;
		for(var y=0; y<m_maxsize; ++y){
			for(var x=0; x<m_maxsize; ++x){
				if(x<m_size && y<m_size){
					m_map[y][x].show();
				}
				else{
					m_map[y][x].hide();
				}
			}
		}
		m_border_hide();
		if(m_callback){
			m_callback();
		}
	};
	var m_usePen = function(c){
		m_mode = 2;
		m_pen = c;
		m_border_hide();
	};
	var m_useRotate = function(r){
		m_mode = 1;
		if(r<2){
			r = 2;
		}else if(18<r){
			r = 18;
		}else{
			r &= ~1;
		}
		m_r = r / 2;
		m_border_hide();
	};
	var m_rotate = function(x, y, r){
		if(r<=x && r<=y && x<=m_size-r && y<=m_size-r){
			var xx = x * 2 - 1;
			var yy = y * 2 - 1;
			for(var dy=1; dy<r*2; dy+=2){
				for(var dx=1; dx<r*2; dx+=2){
					var dmy = m_map[(yy+dy)/2][(xx+dx)/2];
					m_map[(yy+dy)/2][(xx+dx)/2] = m_map[(yy-dx)/2][(xx+dy)/2];
					m_map[(yy-dx)/2][(xx+dy)/2] = m_map[(yy-dy)/2][(xx-dx)/2];
					m_map[(yy-dy)/2][(xx-dx)/2] = m_map[(yy+dx)/2][(xx-dy)/2]
					m_map[(yy+dx)/2][(xx-dy)/2] = dmy;
					m_map[(yy+dy)/2][(xx+dx)/2].move((xx+dx)/2, (yy+dy)/2);
					m_map[(yy-dx)/2][(xx+dy)/2].move((xx+dy)/2, (yy-dx)/2);
					m_map[(yy-dy)/2][(xx-dx)/2].move((xx-dx)/2, (yy-dy)/2);
					m_map[(yy+dx)/2][(xx-dy)/2].move((xx-dy)/2, (yy+dx)/2);
				}
			}
			return true;
		}
		return false;
	};
	var m_click_event = function(xx, yy, dx, dy){
		if(m_mode==1) {
			var x = xx+dx;
			var y = yy+dy;
			m_rotate(x, y, m_r);
		}
		else if(m_mode==2) {
			m_map[yy][xx].setColor(m_pen);
		}
		if(m_callback){
			m_callback();
		}
	};
	var m_over_event = function(xx, yy, dx, dy){
		if(m_mode==1) {
			var x = xx+dx;
			var y = yy+dy;
			if(m_r<=x && m_r<=y && x<=m_size-m_r && y<=m_size-m_r){
				m_border_move(x, y, m_r * 2);
			} else {
				m_border_hide();
			}
		}
		else if(m_mode==2) {
			if(xx<m_size && yy<=m_size){
				m_border_pen(xx, yy);
			} else {
				m_border_hide();
			}
		}
	};
	//init
	(function() {
		m_DOM.css('width', m_maxsize*32).css('height', m_maxsize*32);
		for(var y=0; y<m_maxsize; ++y) {
			var m = [];
			for(var x=0; x<m_maxsize; ++x) {
				var b = pc2009.newBlock(x, y, 0);
				m[x] = b;
				m_DOM.append(b);
			}
			m_map[y] = m;
		}
		for(var y=0; y<m_maxsize; ++y) {
			for(var x=0; x<m_maxsize; ++x) {
				for(var dx=0; dx<2; ++dx) {
					for(var dy=0; dy<2; ++dy) {
						var b = pc2009.newMouseSensor2(x, y, dx, dy, m_click_event, m_over_event);
						m_DOM.append(b);
					}
				}
			}
		}
	}());
	m_DOM.useRotate = m_useRotate;
	m_DOM.usePen = m_usePen;
	m_DOM.setSize = m_setSize;
	m_DOM.getCsv = m_getCsv;
	m_DOM.loadCsv = m_loadCsv;
	return m_DOM;
};

var pc2009 = pc2009 || {};
pc2009.newButtonBar = function(list) {
	// var
	var m_DOM = jQuery('<div></div>');
	var m_DOM_img_list = [];
	var m_clearBoarder = function(){
		for(var i=0; i<m_DOM_img_list.length; ++i){
			m_DOM_img_list[i].css('border-color', '#ffffff');
		}
	};
	(function(){
		var func3;
		for(var i=0; i<list.length; ++i){
			if(i!=0){
				m_DOM.append(' ');
			}
			if(list[i][0]==''){
				m_DOM.append('<br />');
			}
			else{
				var DOM_img = jQuery('<img src="'+list[i][0]+'" />').css('border', '2px solid').css('border-color', '#ffffff');
				(function(){
					var img = DOM_img;
					var func = list[i][1];
					var func2 = function(){
						m_clearBoarder();
						img.css('border-color', '#000000');
						func();
					};
					img.click(func2);
					if(!func3){
						func3 = func2;
					}
				}());
				m_DOM_img_list.push(DOM_img);
				m_DOM.append(DOM_img);
			}
		}
		if(func3){
			func3();
		}
	}());
	return m_DOM;
};

